/* 
 react是什么: 构建用户界面的 js 库
 react脚手架: npx create-react-app xxx
 react 创建虚拟dom(本质上对象)
  🤞用的不多：React.createElement('标签',{属性对象},内容)
  ✔建议使用：jsx 语法糖直接构建用户界面

  jsx - 原生不支持，需要使用 babel 解析
  注意点：
    1. 只能有一个根标签，与 vue2 相似
    2. 单标签必须要闭合，建议 <input />
    3. 关键字的冲突， class ---> className, for  ---->  htmlFor
    4. 多行代码，建议用 () 包起来,一般配置了格式化会自动包裹

  jsx - 渲染规则
  1. 基本类型: ✨string number 直接渲染
              boolean undefined null 不会渲染
  2. 引用类型：
        对象：💥虚拟dom中不能直接渲染 对象
        数组：遍历数组的每一项，一般用作 列表渲染
        函数：一般需要调用，把返回的内容渲染
  3. 其他：
        三元表达式： { true : '显示': ''}
        逻辑运算:    { true && '真的时候渲染' } 有需要配套 { !true && '假的时候渲染' }
        jsx本身： { true && <span>jsx本身也是可以渲染</span>}

  jsx-条件渲染，类似 v-if
    1. if/else 语句，是需要写在函数中，返回内容即可
    2. 三元表达式
    3. 逻辑运算

  jsx-列表渲染，类似 v-for
    1. 写了列表渲染，需要加 key
    2. 保证 返回的内容，是可以渲染的 jsx (例如对象就不能直接渲染)


  jsx-样式
    1. 💥内部样式 style = {{}},注意是两个花括号，第一个是 jsx,第二个是样式对象
    2. ✅外部样式， 定义好样式文件，import 引进，通过 className 绑定类名即可


  整个内容渲染
  1. 引进 React 和 ReactDOM
  2. 构建虚拟dom
  3. 页面渲染 ReactDOM.render(虚拟dom,挂载点)
*/
